<?php
$me = $_GET['classic'];
$password = $_GET['password'];
?>
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>查看松江大学城的摩拜</title>
    <style type="text/css">
        html {
            height: 100%
        }

        body {
            height: 100%;
            margin: 0px;
            padding: 0px
        }

        #container {
            height: 100%
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=UT4llqvTpzbApvoSZi39vGy0qewa9eaU">
        //v2.0版本的引用方式：src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"
        //v1.4版本及以前版本的引用方式：src="http://api.map.baidu.com/api?v=1.4&key=您的密钥&callback=initialize"
    </script>
</head>

<body>
<div id="container"></div>
<script src="../Teacher/bootstrap/jquery-3.2.0.min.js"></script>
<script type="text/javascript">
    function Bike(id, lat, lon) {
        this.id = id;
        this.lat = lat;
        this.lon = lon;
    }
    var bikes = [];
    var markers = [];
    var map = new BMap.Map("container");
    var point = new BMap.Point(121.2240072121, 31.0586583917);
    map.centerAndZoom(point, 15);

    map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.ScaleControl());
    var icon = new BMap.Icon('mobike_old.png', new BMap.Size(40, 40), {
        anchor: new BMap.Size(20, 38)
    });

    map.enableScrollWheelZoom();

    $.ajax({
        async: true,
        cache: false,
        type: 'GET',
        url: 'getMobikes.php',
        error: function () {
            alert('获取数据失败');
        },
        success: function (data) {
//            alert(data);
            var dataObj = JSON.parse(data)['data'];
//            alert('size: ' + dataObj.length);
            for (var i = 0; i < dataObj.length; i++) {
                var lat = dataObj[i].lat;
                var lon = dataObj[i].lon;
                translate(new BMap.Point(lon, lat));
            }
        }
    });

    function addMarker(lng, lat) {
        var point = new BMap.Point(lng, lat);
        var markerBike = new BMap.Marker(point, {
            icon: icon
        });
        map.addOverlay(markerBike);
    }

    translateCallback = function (data) {
        if (data.status === 0) {
            addMarker(data.points[0].lng, data.points[0].lat);
        }
    };

    function translate(ggPoint) {
//       alert('1');
        var convertor = new BMap.Convertor();
        var pointArr = [];
        pointArr.push(ggPoint);
        convertor.translate(pointArr, 3, 5, translateCallback)
    }

    //    }
    //
    //    addMarker(point, 0);


</script>
</body>
</html>